<template>
  <div style=" margin: 30px;">
      <el-tabs style="margin-top:15px;" v-model="activeName">
          <el-tab-pane v-for="item in tabMap" :label="item.name" :key="item.id" :name="item.code">
              <keep-alive>
                  <tab-pane v-if="activeName==item.code" :type="item.id"></tab-pane>
              </keep-alive>
          </el-tab-pane>
      </el-tabs>
  </div>
</template>

<script>
import tabPane from './compenents/groupDetail';
import {
    getAllGroupTypes
} from 'api/groupType/index'
export default {
  name: 'group',
  components: {
      tabPane
  },
  data(){
      return{
          activeName: 'role',
          tabMap: []
      }
  },
  created() {
      this.fetchDate();
  },
  methods: {
      fetchDate(){
          getAllGroupTypes().then(data => {
              this.tabMap = data.data;
          });
      }
  }
}
</script>
